<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>WITB? - {{ title }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    {% load static %}
    {% get_static_prefix as STATIC_PREFIX %}
    <link href="{{ STATIC_PREFIX }}css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }

      #header{
        text-align:center;
      }

      .tagline{
        margin-top:2%;
        margin-left:26%;
      }
      .tagline p{
        text-align:left;
      }

      footer{
        text-align:center;
      }
      footer p{
        font-size:1.2em;
      }

    </style>
    <link href="{{ STATIC_PREFIX }}css/bootstrap-responsive.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>

  <body>
    <div class="container">

      <div class="row">
        <div id="header" class="well span6 offset3">
          <h1>Where in the BOB?</h1>
          <div class="tagline">
           <p>Can't find a tutorial room? <br />
           Don't know where Room 420 is?</p>
           <p>There's an app for that!</a>
          </div>

           <p>
            <form class="form-horizontal" action="/search/" method="get">
              <input name="search_string" type="text" value="{{ keywords }}" > 
              <input class="btn btn-primary" type="submit" value="Search!"></>
            </form>
           </p>
        </div>
      </div>

      {% if not home %}
      <div class="row">
        {% block content %}{% endblock %}
      </div>
      {% endif %}

      <div class="row">
          <footer class="well span6 offset3">
            <p>
              <a href="#">About</a> | 
              <a href="#">GU Campus</a> |
              <a href="/directory">Rooms and floors directory</a> |
              <a href="#">Feedback</a>
            </p>
          </footer>
      </div>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="{{ STATIC_PREFIX }}js/jquery.js"></script>

  </body>
</html>
